import React, { Component } from 'react';

/**
 * 学习目标：组件通讯
 */

export default class App extends Component {
  render() {
    return (
      <div>
        <Child name="LZ" mag="理智"></Child>
        <ChildClass name="生活愉快" msg="难得"></ChildClass>
      </div>
    );
  }
}

// 解构写法
// 函数式组件通过形参props接收
function Child({ name, mag }) {
  return (
    <h1>
      {name}--{mag}
    </h1>
  );
}

class ChildClass extends React.Component {
  render() {
    console.log(this);
    //  接收数据，通过props对象
    //   类组件通过this.props接收
    //   在render下面解构
    const { name, msg } = this.props;
    return (
      <h1>
        {name}---{msg}
      </h1>
    );
  }
}
